import Toast from '@/components/utils/toast.vue';

var plugin = {}
//删除dom元素
let removeDom = event => {
    event.target.parentNode.removeChild(event.target);

}

plugin.install = function (Vue, options = {}) {
	const ToastController = Vue.extend(Toast);
	// 实现toast的关闭方法
	ToastController.prototype.close = function () {
		
		this.visiable = false;
		this.$el.addEventListener('transitionend', removeDom);
	}
	
	// 在Vue的原型上实现toast的挂在以及功能实现
	// 用户可以再Vue实例通过this.$Toast来访问以下的内容
	
	Vue.prototype.$toast = (option = {}) => {
		//toast实例挂在到刚创建的Div
		var instance = new ToastController().$mount(document.createElement('div'));
		let duration = option.duration || options.duration || 2500;
		
		// 如果用户在Vue实例中没有设置option的属性message，则直接将option的内容作为message的信息进行toast内容展示
		instance.message = typeof option === 'string' ? option : options.message;

		// 将toast挂在到DOM上
		document.body.appendChild(instance.$el);

		//实现自动关闭
		setTimeout(function () {
			instance.close();
		}, duration)
	}

}

export default plugin;